<template>
  <div class="new-head">
      <div class="new-head-center">
          <span>
              <img src="http://192.168.2.27:8888/assets/img/ford-logo1.png" alt="">
          </span>
          <ul class="new-ul">
              <li><span>HOME</span></li>
              <li><span>MODEL</span></li>
              <li><span>PARAMETER</span></li>
              <li><span>RECOMMEND</span></li>
              <li><span>SPECS</span></li>
          </ul>
      </div>
  </div>
</template>

<script>
export default {

}
</script>

<style scoped>
.new-head {
    width: 100%;
    /* background-color: green; */
}
.new-head-center {
    margin: 0 auto;
    max-width: 1100px;
    /* height: 50px; */
    background-color: lightskyblue;
    display: flex;
}
.new-head-center>span {
    display: inline-block; 
    max-width: 100px;
    /* background-color: red; */
    /* float: left; */
}
img {
    width: 100%;
    height: 100%;
    vertical-align: top;
}
.new-ul {
    display: flex;
    list-style: none;
    width: 60%;
    height:100%;
    /* height: 100%; */
    margin: auto 0 auto 5%;
    margin-left: 5%;
    background-color: yellow;
}
.new-ul li {
    flex:20%;
    background-color: #4d4d4d;
    text-align: center;
    margin-right: 10px;
}
.new-ul li span {
    background-color: red;
    display: block;
    width: 100%; 
    line-height: 50px;
    color: white;
    font-weight: 800;
     /* line-height: 4.2em; */
}
</style>